<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <!-- 块级元素通常用于组织和布局页面的主要结构和内容，
    例如段落、标题、列表、表格等。它们用于创建页面的要部分，将内容分隔成逻辑块
    块级元素通常会从新行开始，并占据整行的宽度，因此它们会在页面上呈现为一块独立的内容块。
    可以包含其他块级元素和行内元素。常见的块级元素包括' -->
    <!-- <div><p><h1><h6><table><fomm><o1><U1> -->
    <!-- 行内元素通常用于添加文本样式或为文本中的一部分应用样式。它们可以在文本中插入小的元素，
     例如超链接.强调文本等。
     行内元素通常在同一行内呈现，不会独占一行。 它们只占据其内容所需的宽度，而不是整行的宽度。
     行内元素不能包含块级元素，但可以包含其他行内元素。常见的行内元素包括 -->
    <!-- <span><a><strong><em><img><br><input> -->
    <div class="nav">
        <a href="">链接1</a>
        <a href="">链接2</a>
        <a href="">链接3</a>
        <a href="">链接4</a>
        <a href="">链接5</a>
    </div>

    <div class="content">
        <h1>文章标题</h1>
        <p>文章内容1111</p>
        <p>文章内容222</p>
    </div>
    <hr>    
    <span>内容 这是第一个span标签</span>
    <span>内容 这是第二个span标签</span>
    <span>内容 这是第三个span标签</span>
</body>

</html>